<template>
  <div>
    <span>是否开启验证</span>
    <el-switch
      v-model="isNeedCaptcha"
      class="captcha-img"
      active-color="#13ce66"
      inactive-color="#ff4949"
      disabled
      @click.native="changeIsNeedCaptcha(isNeedCaptcha)"
    ></el-switch>
  </div>
</template>
 
<script>
export default {
  name: 'switch-test',
  data () {
    return {
      isNeedCaptcha: false
    }
  },
  methods: {
    // 开启关闭验证
    async changeIsNeedCaptcha (value) {
      this.$confirm(`此操作将${!value ? '开启' : '关闭'}验证, 是否继续？`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(async () => {
        this.isNeedCaptcha = !value
      }).catch(() => {
        this.$message.error('取消操作')
      })
    },
  },
  mounted () {
 
  },
}
</script>
 
<style >

</style>